﻿<!DOCTYPE html>
<!-- Head -->

<head>
    <meta charset="utf-8" />
    <title>管理员后台 - 首页</title>

    <meta name="description" content="Dashboard" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="shortcut icon" href="logo_small.ico" type="image/x-icon">
    <link rel="stylesheet" href="calendar.css">

    <!--Basic Styles-->
    <link href="assets/css/bootstrap.min.css" rel="stylesheet" />
    <link id="bootstrap-rtl-link" href="" rel="stylesheet" />
    <link href="assets/css/font-awesome.min.css" rel="stylesheet" />
    <link href="assets/css/weather-icons.min.css" rel="stylesheet" />

    <!--Fonts-->
    <link href="http://fonts.useso.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,400,600,700,300"
        rel="stylesheet" type="text/css">

    <!--Beyond styles-->
    <link id="beyond-link" href="assets/css/beyond.min.css" rel="stylesheet" type="text/css" />
    <link href="assets/css/demo.min.css" rel="stylesheet" />
    <link href="assets/css/typicons.min.css" rel="stylesheet" />
    <link href="assets/css/animate.min.css" rel="stylesheet" />
    <link id="skin-link" href="" rel="stylesheet" type="text/css" />

    <!--Skin Script: Place this script in head to load scripts for skins and rtl support-->
    <script src="assets/js/skins.min.js"></script>
    <style type="text/css">
        body {
            position: relative;
        }

        .navbar .navbar-inner {
            background: #cacaca !important;
        }

        .calendar {
            position: absolute;
            left: 310px;
            height: 300px !important;
        }

        .navbar .navbar-brand small img {
            width: fit-content !important;
            transform: translateX(60px);
        }
    </style>
</head>
<!-- /Head -->
<!-- Body -->

<body>
    <!-- Loading Container -->
    <div class="loading-container">
        <div class="loading-progress">
            <div class="rotator">
                <div class="rotator">
                    <div class="rotator colored">
                        <div class="rotator">
                            <div class="rotator colored">
                                <div class="rotator colored"></div>
                                <div class="rotator"></div>
                            </div>
                            <div class="rotator colored"></div>
                        </div>
                        <div class="rotator"></div>
                    </div>
                    <div class="rotator"></div>
                </div>
                <div class="rotator"></div>
            </div>
            <div class="rotator"></div>
        </div>
    </div>
    <!--  /Loading Container -->
    <!-- Navbar -->
    <div class="navbar">
        <div class="navbar-inner">
            <div class="navbar-container">
                <!-- Navbar Barnd -->
                <div class="navbar-header pull-left">
                    <a href="#" class="navbar-brand">
                        <small>
                            <img src="logo.png" alt="" >
                        </small>
                    </a>
                </div>
                <!-- /Navbar Barnd -->

                <!-- Sidebar Collapse -->
                <div class="sidebar-collapse" id="sidebar-collapse">
                    <i class="collapse-icon fa fa-bars"></i>
                </div>
                <!-- /Sidebar Collapse -->
                <!-- Account Area and Settings --->
                <div class="navbar-header pull-right">
                    <div class="navbar-account">
                        <ul class="account-area">
                            <li>
                                <a class="dropdown-toggle" data-toggle="dropdown" title="Tasks" href="#">
                                    <i class="icon fa fa-tasks"></i>
                                    <span class="badge">4</span>
                                </a>
                                <!--Tasks Dropdown-->
                                <ul class="pull-right dropdown-menu dropdown-tasks dropdown-arrow ">
                                    <li class="dropdown-header bordered-darkorange">
                                        <i class="fa fa-tasks"></i>
                                        待处理任务进程
                                    </li>
                                    <li>
                                        <a href="#">
                                            <div class="clearfix">
                                                <span class="pull-left">问题账户管理</span>
                                                <span class="pull-right">65%</span>
                                            </div>

                                            <div class="progress progress-xs">
                                                <div style="width:65%" class="progress-bar"></div>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#">
                                            <div class="clearfix">
                                                <span class="pull-left">数据分析</span>
                                                <span class="pull-right">35%</span>
                                            </div>

                                            <div class="progress progress-xs">
                                                <div style="width:35%" class="progress-bar progress-bar-success"></div>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#">
                                            <div class="clearfix">
                                                <span class="pull-left">数据更新与备份</span>
                                                <span class="pull-right">75%</span>
                                            </div>

                                            <div class="progress progress-xs">
                                                <div style="width:75%" class="progress-bar progress-bar-darkorange">
                                                </div>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#">
                                            <div class="clearfix">
                                                <span class="pull-left">商家审核</span>
                                                <span class="pull-right">10%</span>
                                            </div>

                                            <div class="progress progress-xs">
                                                <div style="width:10%" class="progress-bar progress-bar-warning"></div>
                                            </div>
                                        </a>
                                    </li>
                                    <li class="dropdown-footer">
                                        <a href="#">
                                            全部任务
                                        </a>
                                        <button class="btn btn-xs btn-default shiny darkorange icon-only pull-right"><i
                                                class="fa fa-check"></i></button>
                                    </li>
                                </ul>
                                <!--/Tasks Dropdown-->
                            </li>
                            <li>
                                <a class="login-area dropdown-toggle" data-toggle="dropdown">
                                    <div class="avatar" title="View your public profile">
                                        <img src="assets/img/avatars/user.jpg">
                                    </div>
                                    <section>
                                        <h2><span class="profile"><span>#54613管理员</span></span></h2>
                                    </section>
                                </a>
                                <!--Login Area Dropdown-->
                                <ul class="pull-right dropdown-menu dropdown-arrow dropdown-login-area">
                                    <li class="username"><a>#54613管理员</a></li>
                                    <li class="email"><a></a></li>
                                    <!--Avatar Area-->
                                    <li>
                                        <div class="avatar-area">
                                            <img src="assets/img/avatars/user.jpg" class="avatar">
                                            <span class="caption">更换头像</span>
                                        </div>
                                    </li>
                                    <!--Avatar Area-->
                                    <li class="edit">
                                        <a href="profile.html" class="pull-left">简介</a>
                                        <a href="#" class="pull-right">设置</a>
                                    </li>
                                    <!--Theme Selector Area-->
                                    <li class="theme-area">
                                        <ul class="colorpicker" id="skin-changer">
                                            <li><a class="colorpick-btn" href="#" style="background-color:#5DB2FF;"
                                                    rel="assets/css/skins/blue.min.css"></a></li>
                                            <li><a class="colorpick-btn" href="#" style="background-color:#2dc3e8;"
                                                    rel="assets/css/skins/azure.min.css"></a></li>
                                            <li><a class="colorpick-btn" href="#" style="background-color:#03B3B2;"
                                                    rel="assets/css/skins/teal.min.css"></a></li>
                                            <li><a class="colorpick-btn" href="#" style="background-color:#53a93f;"
                                                    rel="assets/css/skins/green.min.css"></a></li>
                                            <li><a class="colorpick-btn" href="#" style="background-color:#FF8F32;"
                                                    rel="assets/css/skins/orange.min.css"></a></li>
                                            <li><a class="colorpick-btn" href="#" style="background-color:#cc324b;"
                                                    rel="assets/css/skins/pink.min.css"></a></li>
                                            <li><a class="colorpick-btn" href="#" style="background-color:#AC193D;"
                                                    rel="assets/css/skins/darkred.min.css"></a></li>
                                            <li><a class="colorpick-btn" href="#" style="background-color:#8C0095;"
                                                    rel="assets/css/skins/purple.min.css"></a></li>
                                            <li><a class="colorpick-btn" href="#" style="background-color:#0072C6;"
                                                    rel="assets/css/skins/darkblue.min.css"></a></li>
                                            <li><a class="colorpick-btn" href="#" style="background-color:#585858;"
                                                    rel="assets/css/skins/gray.min.css"></a></li>
                                            <li><a class="colorpick-btn" href="#" style="background-color:#474544;"
                                                    rel="assets/css/skins/black.min.css"></a></li>
                                            <li><a class="colorpick-btn" href="#" style="background-color:#001940;"
                                                    rel="assets/css/skins/deepblue.min.css"></a></li>
                                        </ul>
                                    </li>
                                    <!--/Theme Selector Area-->
                                    <li class="dropdown-footer">
                                        <a href="login.html">
                                            退出
                                        </a>
                                    </li>
                                </ul>
                                <!--/Login Area Dropdown-->
                            </li>
                            <!-- /Account Area -->
                            <!--Note: notice that setting div must start right after account area list.
                            no space must be between these elements-->
                            <!-- Settings -->
                        </ul>
                        <div class="setting">
                            <a id="btn-setting" title="Setting" href="#">
                                <i class="icon glyphicon glyphicon-cog"></i>
                            </a>
                        </div>
                        <div class="setting-container">
                            <label>
                                <input type="checkbox" id="checkbox_fixednavbar">
                                <span class="text">固定导航栏</span>
                            </label>
                            <label>
                                <input type="checkbox" id="checkbox_fixedsidebar">
                                <span class="text">固定侧边栏</span>
                            </label>
                            <label>
                                <input type="checkbox" id="checkbox_fixedbreadcrumbs">
                                <span class="text">固定面包屑导航栏</span>
                            </label>
                            <label>
                                <input type="checkbox" id="checkbox_fixedheader">
                                <span class="text">固定全部</span>
                            </label>
                        </div>
                        <!-- Settings -->
                    </div>
                </div>
                <!-- /Account Area and Settings -->
            </div>
        </div>
    </div>
    <!-- /Navbar -->
    <!-- Main Container -->
    <div class="main-container container-fluid">
        <!-- Page Container -->
        <div class="page-container">
            <!-- Page Sidebar -->
            <div class="page-sidebar" id="sidebar">
                <!-- Page Sidebar Header-->
                <div class="sidebar-header-wrapper">
                    <input type="text" class="searchinput" />
                    <i class="searchicon fa fa-search"></i>
                    <div class="searchhelper">Search Reports, Charts, Emails or Notifications</div>
                </div>
                <!-- /Page Sidebar Header -->
                <!-- Sidebar Menu -->
                <ul class="nav sidebar-menu">
                    <!--Dashboard-->
                    <li class="active">
                        <a href="index.html">
                            <i class="menu-icon glyphicon glyphicon-home"></i>
                            <span class="menu-text"> 业绩分析 </span>
                        </a>
                    </li>
                    <!--Tables-->
                    <li>
                        <a href="#" class="menu-dropdown">
                            <i class="menu-icon fa fa-table"></i>
                            <span class="menu-text"> 平台管理 </span>

                            <i class="menu-expand"></i>
                        </a>

                        <ul class="submenu">
                            <li>
                                <a href="tables-data.html">
                                    <span class="menu-text">平台相关数据管理</span>
                                </a>
                            </li>
                        </ul>
                    </li>
                    <!--Charts-->
                    <li>
                        <a href="#" class="menu-dropdown">
                            <i class="menu-icon fa fa-bar-chart-o"></i>
                            <span class="menu-text"> 数据可视化 </span>

                            <i class="menu-expand"></i>
                        </a>

                        <ul class="submenu">
                            <!-- <li>
                                <a href="flot.html">
                                    <span class="menu-text"> 表一</span>
                                </a>
                            </li> -->

                            <li>
                                <a href="morris.html">
                                    <span class="menu-text">可视化分析</span>
                                </a>
                            </li>
                            <!-- <li>
                                <a href="sparkline.html">
                                    <span class="menu-text"> 表三</span>
                                </a>
                            </li>
                            <li>
                                <a href="easypiecharts.html">
                                    <span class="menu-text"> 表四</span>
                                </a>
                            </li>
                            <li>
                                <a href="chartjs.html">
                                    <span class="menu-text"> 表五</span>
                                </a>
                            </li> -->
                        </ul>
                    </li>
                </ul>
            </div>
            <!-- /Page Sidebar -->
            <!-- Page Content -->
            <div class="page-content">
                <!-- Page Breadcrumb -->
                <div class="page-breadcrumbs">
                    <ul class="breadcrumb">
                        <li>
                            <a href="index.html" style="margin-right: 2px;"><i class="fa fa-home"></i></a>
                            业绩分析
                        </li>
                    </ul>
                </div>
                <!-- /Page Breadcrumb -->
                <!-- Page Header -->
                <div class="page-header position-relative">
                    <div class="header-title">
                        <h1>
                            平台运营数据
                        </h1>
                    </div>
                    <!--Header Buttons-->
                    <div class="header-buttons">
                        <a class="sidebar-toggler" href="#">
                            <i class="fa fa-arrows-h"></i>
                        </a>
                        <a class="refresh" id="refresh-toggler" href="">
                            <i class="glyphicon glyphicon-refresh"></i>
                        </a>
                        <a class="fullscreen" id="fullscreen-toggler" href="#">
                            <i class="glyphicon glyphicon-fullscreen"></i>
                        </a>
                    </div>
                    <!--Header Buttons End-->
                </div>
                <!-- /Page Header -->
                <!-- Page Body -->
                <div class="page-body">
                    <div class="row">
                        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                            <div class="row">
                                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                                    <div class="databox radius-bordered databox-shadowed databox-graded">
                                        <div class="databox-left bg-themesecondary">
                                            <div class="databox-piechart">
                                                <div data-toggle="easypiechart" class="easyPieChart"
                                                    data-barcolor="#fff" data-linecap="butt" data-percent="50"
                                                    data-animate="500" data-linewidth="3" data-size="47"
                                                    data-trackcolor="rgba(255,255,255,0.1)"><span
                                                        class="white font-90">50%</span></div>
                                            </div>
                                        </div>
                                        <div class="databox-right">
                                            <span class="databox-number themesecondary">14</span>
                                            <div class="databox-text darkgray">新任务</div>
                                            <div class="databox-stat themesecondary radius-bordered">
                                                <i class="stat-icon icon-lg fa fa-tasks"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                                    <div class="databox radius-bordered databox-shadowed databox-graded">
                                        <div class="databox-left bg-themethirdcolor">
                                            <div class="databox-piechart">
                                                <div data-toggle="easypiechart" class="easyPieChart"
                                                    data-barcolor="#fff" data-linecap="butt" data-percent="15"
                                                    data-animate="500" data-linewidth="3" data-size="47"
                                                    data-trackcolor="rgba(255,255,255,0.2)"><span
                                                        class="white font-90">15%</span></div>
                                            </div>
                                        </div>
                                        <div class="databox-right">
                                            <span class="databox-number themethirdcolor">1</span>
                                            <div class="databox-text darkgray">新邮件</div>
                                            <div class="databox-stat themethirdcolor radius-bordered">
                                                <i class="stat-icon  icon-lg fa fa-envelope-o"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                                    <div class="databox radius-bordered databox-shadowed databox-graded">
                                        <div class="databox-left bg-themeprimary">
                                            <div class="databox-piechart">
                                                <div id="users-pie" data-toggle="easypiechart" class="easyPieChart"
                                                    data-barcolor="#fff" data-linecap="butt" data-percent="76"
                                                    data-animate="500" data-linewidth="3" data-size="47"
                                                    data-trackcolor="rgba(255,255,255,0.1)"><span
                                                        class="white font-90">76%</span></div>
                                            </div>
                                        </div>
                                        <div class="databox-right">
                                            <span class="databox-number themeprimary">98</span>
                                            <div class="databox-text darkgray">新商家</div>
                                            <div class="databox-state bg-themeprimary">
                                                <i class="fa fa-check"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                                    <div class="databox radius-bordered databox-shadowed databox-graded">
                                        <div class="databox-left no-padding bordered-left-2 bordered-palegreen">
                                            <img src="assets/img/avatars/name.jpg"
                                                style="width:65px; height:65px;">
                                        </div>
                                        <div class="databox-right padding-top-20">
                                            <div class="databox-stat palegreen">
                                                <i class="stat-icon icon-xlg fa fa-phone"></i>
                                            </div>
                                            <div class="databox-text darkgray">庞盛淘</div>
                                            <div class="databox-text darkgray">平台维护员</div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-9 col-md-9 col-sm-12 col-xs-12">
                            <div class="row">
                                <div class="col-xs-12">
                                    <div class="dashboard-box">
                                        <div class="box-header">
                                            <div class="deadline">
                                                剩余天数: 109
                                            </div>
                                        </div>
                                        <div class="box-progress">
                                            <div class="progress-handle">20天</div>
                                            <div class="progress progress-xs progress-no-radius bg-whitesmoke">
                                                <div class="progress-bar" role="progressbar" aria-valuenow="60"
                                                    aria-valuemin="0" aria-valuemax="100" style="width: 20%">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="box-tabbs">
                                            <div class="tabbable">
                                                <ul class="nav nav-tabs tabs-flat  nav-justified" id="myTab11">
                                                    <li class="active">
                                                        <a data-toggle="tab" href="#visits">
                                                            访问量
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a data-toggle="tab" href="#realtime">
                                                            实时数据
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a data-toggle="tab" id="contacttab" href="#bandwidth">
                                                            同期比较
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a data-toggle="tab" href="#sales">
                                                            出租量
                                                        </a>
                                                    </li>
                                                </ul>
                                                <div class="tab-content tabs-flat no-padding">
                                                    <div id="visits" class="tab-pane active animated fadeInUp">
                                                        <div class="row">
                                                            <div class="col-lg-12 chart-container">
                                                                <div id="dashboard-chart-visits"
                                                                    class="chart chart-lg no-margin"></div>
                                                            </div>
                                                        </div>

                                                    </div>
                                                    <div id="realtime"
                                                        class="tab-pane padding-left-5 padding-right-10 animated fadeInUp">
                                                        <div class="row">
                                                            <div class="col-lg-12">
                                                                <div id="dashboard-chart-realtime"
                                                                    class="chart chart-lg no-margin" style="width:100%">
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div id="bandwidth" class="tab-pane padding-10 animated fadeInUp">
                                                        <div class="databox-sparkline bg-themeprimary">
                                                            <span id="dashboard-bandwidth-chart"
                                                                data-sparkline="compositeline" data-height="250px"
                                                                data-width="100%" data-linecolor="#fff"
                                                                data-secondlinecolor="#eee"
                                                                data-fillcolor="rgba(255,255,255,.1)"
                                                                data-secondfillcolor="rgba(255,255,255,.25)"
                                                                data-spotradius="0" data-spotcolor="#fafafa"
                                                                data-minspotcolor="#fafafa" data-maxspotcolor="#ffce55"
                                                                data-highlightspotcolor="#fff"
                                                                data-highlightlinecolor="#fff" data-linewidth="2"
                                                                data-secondlinewidth="2"
                                                                data-composite="500, 400, 100, 450, 300, 200, 100, 200">
                                                                300,300,400,300,200,300,300,200
                                                            </span>
                                                        </div>
                                                    </div>
                                                    <div id="sales" class="tab-pane animated fadeInUp no-padding-bottom"
                                                        style="padding:20px 20px 0 20px;">
                                                        <div class="row">
                                                            <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                                                                <div
                                                                    class="databox databox-xlg databox-vertical databox-inverted databox-shadowed">
                                                                    <div class="databox-top">
                                                                        <div class="databox-sparkline">
                                                                            <span data-sparkline="line"
                                                                                data-height="125px" data-width="100%"
                                                                                data-fillcolor="false"
                                                                                data-linecolor="themesecondary"
                                                                                data-spotcolor="#fafafa"
                                                                                data-minspotcolor="#fafafa"
                                                                                data-maxspotcolor="#ffce55"
                                                                                data-highlightspotcolor="#ffce55"
                                                                                data-highlightlinecolor="#ffce55"
                                                                                data-linewidth="1.5"
                                                                                data-spotradius="2">
                                                                                1,2,4,3,5,6,8,7,11,14,11,12
                                                                            </span>
                                                                        </div>
                                                                    </div>
                                                                    <div
                                                                        class="databox-bottom no-padding text-align-center">
                                                                        <span
                                                                            class="databox-number lightcarbon no-margin">224</span>
                                                                        <span
                                                                            class="databox-text lightcarbon no-margin">出租数量/小时</span>

                                                                    </div>
                                                                </div>

                                                            </div>
                                                            <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                                                                <div
                                                                    class="databox databox-xlg databox-vertical databox-inverted databox-shadowed">
                                                                    <div class="databox-top">
                                                                        <div class="databox-sparkline">
                                                                            <span data-sparkline="line"
                                                                                data-height="125px" data-width="100%"
                                                                                data-fillcolor="false"
                                                                                data-linecolor="themefourthcolor"
                                                                                data-spotcolor="#fafafa"
                                                                                data-minspotcolor="#fafafa"
                                                                                data-maxspotcolor="#8cc474"
                                                                                data-highlightspotcolor="#8cc474"
                                                                                data-highlightlinecolor="#8cc474"
                                                                                data-linewidth="1.5"
                                                                                data-spotradius="2">
                                                                                100,208,450,298,450,776,234,680,1100,1400,1000,1200
                                                                            </span>
                                                                        </div>
                                                                    </div>
                                                                    <div
                                                                        class="databox-bottom no-padding text-align-center">
                                                                        <span
                                                                            class="databox-number lightcarbon no-margin">7063￥</span>
                                                                        <span
                                                                            class="databox-text lightcarbon no-margin">收入/小时</span>

                                                                    </div>
                                                                </div>

                                                            </div>
                                                            <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                                                                <div
                                                                    class="databox databox-xlg databox-vertical databox-inverted databox-shadowed">
                                                                    <div class="databox-top">
                                                                        <div class="databox-piechart">
                                                                            <div data-toggle="easypiechart"
                                                                                class="easyPieChart block-center"
                                                                                data-barcolor="themeprimary"
                                                                                data-linecap="butt" data-percent="80"
                                                                                data-animate="500" data-linewidth="8"
                                                                                data-size="125" data-trackcolor="#eee">
                                                                                <span class="font-200"><i
                                                                                        class="fa fa-gift themeprimary"></i></span>
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                    <div
                                                                        class="databox-bottom no-padding text-align-center">
                                                                        <span
                                                                            class="databox-number lightcarbon no-margin">9</span>
                                                                        <span
                                                                            class="databox-text lightcarbon no-margin">新订单</span>

                                                                    </div>
                                                                </div>
                                                            </div>
                                                            <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                                                                <div
                                                                    class="databox databox-xlg databox-vertical databox-inverted  databox-shadowed">
                                                                    <div class="databox-top">
                                                                        <div class="databox-piechart">
                                                                            <div data-toggle="easypiechart"
                                                                                class="easyPieChart block-center"
                                                                                data-barcolor="themethirdcolor"
                                                                                data-linecap="butt" data-percent="40"
                                                                                data-animate="500" data-linewidth="8"
                                                                                data-size="125" data-trackcolor="#eee">
                                                                                <span class="white font-200"><i
                                                                                        class="fa fa-tags themethirdcolor"></i></span>
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                    <div
                                                                        class="databox-bottom no-padding text-align-center">
                                                                        <span
                                                                            class="databox-number lightcarbon no-margin">11</span>
                                                                        <span
                                                                            class="databox-text lightcarbon no-margin">新账单</span>

                                                                    </div>
                                                                </div>
                                                            </div>

                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="box-days">
                                            <div class="row">
                                                <div class=" col-lg-1 col-md-1 col-sm-6 col-xs-12">
                                                    <a class="day-container" href="">
                                                        <div class="day">16</div>
                                                        <div class="month">四月</div>
                                                    </a>
                                                </div>
                                                <div class=" col-lg-1 col-md-1 col-sm-6 col-xs-12">
                                                    <a class="day-container" href="">
                                                        <div class="day">15</div>
                                                        <div class="month">三月</div>
                                                        <b class="day-pin"></b>
                                                    </a>
                                                </div>
                                                <div class=" col-lg-1 col-md-1 col-sm-6 col-xs-12">
                                                    <a class="day-container highlight" href="">
                                                        <div class="day">11</div>
                                                        <div class="month">二月</div>
                                                    </a>
                                                </div>
                                                <div class=" col-lg-1 col-md-1 col-sm-6 col-xs-12">
                                                    <a class="day-container" href="">
                                                        <div class="day">09</div>
                                                        <div class="month">一月</div>
                                                    </a>
                                                </div>
                                                <div class=" col-lg-1 col-md-1 col-sm-6 col-xs-12">
                                                    <a class="day-container " href="">
                                                        <div class="day">14</div>
                                                        <div class="month">十二</div>
                                                        <b class="day-pin"></b>
                                                    </a>
                                                </div>
                                                <div class=" col-lg-1 col-md-1 col-sm-6 col-xs-12">
                                                    <a class="day-container" href="">
                                                        <div class="day">01</div>
                                                        <div class="month">十一</div>
                                                    </a>
                                                </div>
                                                <div class=" col-lg-6 col-md-6 col-sm-12 col-xs-12">
                                                    <a class="day-container all" href="">
                                                        <div class="day" style="margin-top: 15px !important;">2020-2021
                                                        </div>
                                                        <!-- <div class="month">SEE ALL</div> -->
                                                        <span class="day-more">
                                                            <i></i>
                                                        </span>
                                                    </a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
                            <div class="orders-container">
                                <div class="orders-header">
                                    <h6>最新订单</h6>
                                </div>
                                <ul class="orders-list">
                                    <li class="order-item">
                                        <div class="row">
                                            <div class="col-lg-8 col-md-8 col-sm-8 col-xs-8 item-left">
                                                <div class="item-booker">一如既往</div>
                                                <div class="item-time">
                                                    <i class="fa fa-calendar"></i>
                                                    <span>10分钟前</span>
                                                </div>
                                            </div>
                                            <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4 item-right">
                                                <div class="item-price">
                                                    <span class="currency">￥</span>
                                                    <span class="price">400</span>
                                                </div>
                                            </div>
                                        </div>
                                        <a class="item-more" href="">
                                            <i></i>
                                        </a>
                                    </li>
                                    <li class="order-item top">
                                        <div class="row">
                                            <div class="col-lg-8 col-md-8 col-sm-8 col-xs-8 item-left">
                                                <div class="item-booker">神马东西</div>
                                                <div class="item-time">
                                                    <i class="fa fa-calendar"></i>
                                                    <span>2小时前</span>
                                                </div>
                                            </div>
                                            <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4 item-right">
                                                <div class="item-price">
                                                    <span class="currency">￥</span>
                                                    <span class="price">620</span>
                                                </div>
                                            </div>
                                        </div>
                                        <a class="item-more" href="">
                                            <i></i>
                                        </a>
                                    </li>
                                    <li class="order-item">
                                        <div class="row">
                                            <div class="col-lg-8 col-md-8 col-sm-8 col-xs-8 item-left">
                                                <div class="item-booker">波风水门</div>
                                                <div class="item-time">
                                                    <i class="fa fa-calendar"></i>
                                                    <span>4月7日</span>
                                                </div>
                                            </div>
                                            <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4 item-right">
                                                <div class="item-price">
                                                    <span class="currency">￥</span>
                                                    <span class="price">220</span>
                                                </div>
                                            </div>
                                        </div>
                                        <a class="item-more" href="">
                                            <i></i>
                                        </a>
                                    </li>
                                    <li class="order-item">
                                        <div class="row">
                                            <div class="col-lg-8 col-md-8 col-sm-8 col-xs-8 item-left">
                                                <div class="item-booker">麦克磊磊</div>
                                                <div class="item-time">
                                                    <i class="fa fa-calendar"></i>
                                                    <span>4月6日</span>
                                                </div>
                                            </div>
                                            <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4 item-right">
                                                <div class="item-price">
                                                    <span class="currency">￥</span>
                                                    <span class="price">400</span>
                                                </div>
                                            </div>
                                        </div>
                                        <a class="item-more" href="">
                                            <i></i>
                                        </a>
                                    </li>
                                    <li class="order-item">
                                        <div class="row">
                                            <div class="col-lg-8 col-md-8 col-sm-8 col-xs-8 item-left">
                                                <div class="item-booker">丹宁执着</div>
                                                <div class="item-time">
                                                    <i class="fa fa-calendar"></i>
                                                    <span>4月1日</span>
                                                </div>
                                            </div>
                                            <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4 item-right">
                                                <div class="item-price">
                                                    <span class="currency">￥</span>
                                                    <span class="price">340</span>
                                                </div>
                                            </div>
                                        </div>
                                        <a class="item-more" href="">
                                            <i></i>
                                        </a>
                                    </li>
                                </ul>
                                <div class="orders-footer">
                                    <a class="show-all" href=""><i class="fa fa-angle-down"></i> 查看更多</a>
                                    <div class="help">
                                        <a href=""><i class="fa fa-question"></i></a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-lg-4 col-sm-12 col-xs-12">
                            <div class="widget"></div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col=lg-4 col-md-4 col-sm-12 col-xs-12">
                            <div
                                class="databox databox-lg databox-inverted radius-bordered databox-shadowed databox-graded databox-vertical">
                                <div class="databox-top bg-palegreen no-padding">
                                    <div class="databox-stat white bg-palegreen font-120">
                                        <i class="stat-icon fa fa-caret-down icon-xlg"></i>
                                    </div>
                                    <div class="horizontal-space space-lg"></div>
                                    <div class="databox-sparkline no-margin">
                                        <span data-sparkline="compositebar" data-height="82px" data-width="100%"
                                            data-barcolor="#b0dc81" data-barwidth="10px" data-barspacing="5px"
                                            data-fillcolor="false" data-linecolor="#fff" data-spotradius="3"
                                            data-linewidth="2" data-spotcolor="#fafafa" data-minspotcolor="#fafafa"
                                            data-maxspotcolor="#fff" data-highlightspotcolor="#fff"
                                            data-highlightlinecolor="#fff"
                                            data-composite="7, 6, 5, 7, 9, 10, 8, 7, 6, 6, 4, 7, 8">
                                            8,4,1,2,4,6,2,4,4,8,10,7,10
                                        </span>
                                    </div>
                                </div>
                                <div class="databox-bottom no-padding">
                                    <div class="databox-row">
                                        <div class="databox-cell cell-6 text-align-left">
                                            <span class="databox-text">总销售量</span>
                                            <span class="databox-number">￥23,657</span>
                                        </div>
                                        <div class="databox-cell cell-6 text-align-right">
                                            <span class="databox-text">三月份</span>
                                            <span class="databox-number font-70">￥1,257</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col=lg-4 col-md-4 col-sm-12 col-xs-12">
                            <div
                                class="databox databox-lg databox-inverted radius-bordered databox-shadowed databox-graded databox-vertical">
                                <div class="databox-top bg-orange no-padding">
                                    <div class="databox-stat white bg-orange font-120">
                                        <i class="stat-icon fa fa-caret-up icon-xlg"></i>
                                    </div>
                                    <div class="horizontal-space space-lg"></div>
                                    <div class="databox-sparkline no-margin">
                                        <span data-sparkline="compositebar" data-height="82px" data-width="100%"
                                            data-barcolor="#fb7d64" data-barwidth="10px" data-barspacing="5px"
                                            data-fillcolor="false" data-linecolor="#fff" data-spotradius="3"
                                            data-linewidth="2" data-spotcolor="#fafafa" data-minspotcolor="#fafafa"
                                            data-maxspotcolor="#fff" data-highlightspotcolor="#fff"
                                            data-highlightlinecolor="#fff"
                                            data-composite="7, 6, 5, 7, 9, 10, 8, 6,2,4,1,2,7">
                                            10,7,10,8,4,6, 6, 4, 7, 8 ,4,4,8
                                        </span>
                                    </div>
                                </div>
                                <div class="databox-bottom no-padding">
                                    <div class="databox-row">
                                        <div class="databox-cell cell-6 text-align-left">
                                            <span class="databox-text">用户数量</span>
                                            <span class="databox-number">76,109</span>
                                        </div>
                                        <div class="databox-cell cell-6 text-align-right">
                                            <span class="databox-text">新增</span>
                                            <span class="databox-number font-70">7,540</span>
                                        </div>
                                    </div>
                                </div>
                            </div>

                        </div>
                        <div class="col=lg-4 col-md-4 col-sm-12 col-xs-12">
                            <div
                                class="databox databox-lg databox-inverted radius-bordered databox-shadowed databox-graded databox-vertical">
                                <div class="databox-top bg-azure no-padding">
                                    <div class="databox-stat white bg-azure font-120">
                                        <i class="stat-icon fa fa-caret-up icon-xlg"></i>
                                    </div>
                                    <div class="horizontal-space space-lg"></div>
                                    <div class="databox-sparkline no-margin">
                                        <span data-sparkline="compositebar" data-height="82px" data-width="100%"
                                            data-barcolor="#3bcbef" data-barwidth="10px" data-barspacing="5px"
                                            data-fillcolor="false" data-linecolor="#fff" data-spotradius="3"
                                            data-linewidth="2" data-spotcolor="#fafafa" data-minspotcolor="#fafafa"
                                            data-maxspotcolor="#fff" data-highlightspotcolor="#fff"
                                            data-highlightlinecolor="#fff" data-composite="8,4,1,2,4,6,2,4,4,8,10,7,7">
                                            7, 6, 5, 7, 9, 10, 8, 7, 6, 6, 4, 7, 8
                                        </span>
                                    </div>
                                </div>
                                <div class="databox-bottom no-padding">
                                    <div class="databox-row">
                                        <div class="databox-cell cell-6 text-align-left">
                                            <span class="databox-text">浏览总量</span>
                                            <span class="databox-number">990,541</span>
                                        </div>
                                        <div class="databox-cell cell-6 text-align-right">
                                            <span class="databox-text">三月份</span>
                                            <span class="databox-number font-70">292,123</span>
                                        </div>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>

                </div>
            </div>
            <div class="row">
                <div class="col-lg-6 col-md-12 col-sm-12 col-xs-12">
                    <div class="databox databox-xxlg databox-vertical databox-inverted">
                        <div class="databox-top bg-whitesmoke no-padding">
                            <div class="databox-row row-2 bg-whitesmoke no-padding">
                            </div>
                            <div class="databox-row row-4">
                            </div>
                            <div class="databox-row row-6 no-padding">
                            </div>
                        </div>
                        <div class="databox-bottom bg-whitesmoke no-padding">
                        </div>
                    </div>
                </div>

                <div class="calendar">
                    <div class="title">
                        <div class="head">
                            <a href="#" id="prev"><img src="img/bootstrap-icons-1.4.0/arrow-left-short.svg" alt=""></a>
                            <h2 class="green small" id="calendar-year">Year</h2>
                            <h2 class="green" id="calendar-title">Month</h2>
                            <a href="#" id="next"><img src="img/bootstrap-icons-1.4.0/arrow-right-short.svg" alt=""></a>
                        </div>
                    </div>

                    <div class="body">
                        <div class="lightgrey body-list">
                            <ul>
                                <li>MON</li>
                                <li>TUE</li>
                                <li>WED</li>
                                <li>THU</li>
                                <li>FRI</li>
                                <li>SAT</li>
                                <li>SUN</li>
                            </ul>
                        </div>
                        <div class="darkgrey body-list">
                            <ul id="days">
                            </ul>
                        </div>
                    </div>
                </div>

                <script>
                    var month_olympic = [31, 29, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
                    var month_normal = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
                    var month_name = ["January", "Febrary", "March", "April", "May", "June", "July", "Auguest", "September", "October", "November", "December"];
                    var holder = document.getElementById("days");
                    var prev = document.getElementById("prev");
                    var next = document.getElementById("next");
                    var ctitle = document.getElementById("calendar-title");
                    var cyear = document.getElementById("calendar-year");
                    var my_date = new Date();
                    var my_year = my_date.getFullYear();
                    var my_month = my_date.getMonth();
                    var my_day = my_date.getDate();

                    //获取某年某月第一天是星期几
                    function dayStart(month, year) {
                        var tmpDate = new Date(year, month, 1);
                        return (tmpDate.getDay());
                    }

                    //计算某年是不是闰年，通过求年份除以4的余数即可
                    function daysMonth(month, year) {
                        var tmp = year % 4;
                        if (tmp == 0) {
                            return (month_olympic[month]);
                        } else {
                            return (month_normal[month]);
                        }
                    }

                    function refreshDate() {
                        var str = "";
                        var totalDay = daysMonth(my_month, my_year); //获取该月总天数
                        var firstDay = dayStart(my_month, my_year); //获取该月第一天是星期几
                        var myclass;
                        for (var i = 1; i < firstDay; i++) {
                            str += "<li></li>"; //为起始日之前的日期创建空白节点
                        }
                        for (var i = 1; i <= totalDay; i++) {
                            if ((i < my_day && my_year == my_date.getFullYear() && my_month == my_date.getMonth()) || my_year < my_date.getFullYear() || (my_year == my_date.getFullYear() && my_month < my_date.getMonth())) {
                                myclass = " class='lightgrey'"; //当该日期在今天之前时，以浅灰色字体显示
                            } else if (i == my_day && my_year == my_date.getFullYear() && my_month == my_date.getMonth()) {
                                myclass = " class='green greenbox'"; //当天日期以绿色背景突出显示
                            } else {
                                myclass = " class='darkgrey'"; //当该日期在今天之后时，以深灰字体显示
                            }
                            str += "<li" + myclass + ">" + i + "</li>"; //创建日期节点
                        }
                        holder.innerHTML = str; //设置日期显示
                        ctitle.innerHTML = month_name[my_month]; //设置英文月份显示
                        cyear.innerHTML = my_year; //设置年份显示
                    }
                    refreshDate(); //执行该函数

                    prev.onclick = function (e) {
                        e.preventDefault();
                        my_month--;
                        if (my_month < 0) {
                            my_year--;
                            my_month = 11;
                        }
                        refreshDate();
                    }
                    next.onclick = function (e) {
                        e.preventDefault();
                        my_month++;
                        if (my_month > 11) {
                            my_year++;
                            my_month = 0;
                        }
                        refreshDate();
                    }</script>

                <div class="col-lg-6 col-md-12 col-sm-12 col-xs-12">
                    <div
                        class="databox databox-xxlg databox-vertical databox-shadowed bg-white radius-bordered padding-5">
                        <div class="databox-top">
                            <div class="databox-row row-12">
                                <div class="databox-cell cell-3 text-center">
                                    <div class="databox-number number-xxlg sonic-silver">164</div>
                                    <div class="databox-text storm-cloud">在线订单</div>
                                </div>
                                <div class="databox-cell cell-9 text-align-center">
                                    <div class="databox-row row-6 text-left">
                                        <span class="badge badge-palegreen badge-empty margin-left-5"></span>
                                        <span class="databox-inlinetext uppercase darkgray margin-left-5">新增</span>
                                        <span class="badge badge-yellow badge-empty margin-left-5"></span>
                                        <span class="databox-inlinetext uppercase darkgray margin-left-5">退回</span>
                                    </div>
                                    <div class="databox-row row-6">
                                        <div class="progress bg-yellow progress-no-radius">
                                            <div class="progress-bar progress-bar-palegreen" role="progressbar"
                                                aria-valuenow="20" aria-valuemin="0" aria-valuemax="100"
                                                style="width: 78%">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="databox-bottom">
                            <div class="databox-row row-12">
                                <div class="databox-cell cell-7 text-center  padding-5">
                                    <div id="dashboard-pie-chart-sources" class="chart"></div>
                                </div>
                                <div class="databox-cell cell-5 text-center no-padding-left padding-bottom-30">
                                    <div class="databox-row row-2 bordered-bottom bordered-ivory padding-10">
                                        <span class="databox-text sonic-silver pull-left no-margin">订单类型</span>
                                        <span class="databox-text sonic-silver pull-right no-margin uppercase">比例</span>
                                    </div>
                                    <div class="databox-row row-2 bordered-bottom bordered-ivory padding-10">
                                        <span class="badge badge-blue badge-empty pull-left margin-5"></span>
                                        <span class="databox-text darkgray pull-left no-margin hidden-xs">电子产品型</span>
                                        <span class="databox-text darkgray pull-right no-margin uppercase">46%</span>
                                    </div>
                                    <div class="databox-row row-2 bordered-bottom bordered-ivory padding-10">
                                        <span class="badge badge-orange badge-empty pull-left margin-5"></span>
                                        <span class="databox-text darkgray pull-left no-margin hidden-xs">服装型</span>
                                        <span class="databox-text darkgray pull-right no-margin uppercase">21%</span>
                                    </div>
                                    <div class="databox-row row-2 bordered-bottom bordered-ivory padding-10">
                                        <span class="badge badge-pink badge-empty pull-left margin-5"></span>
                                        <span class="databox-text darkgray pull-left no-margin hidden-xs">饰品型</span>
                                        <span class="databox-text darkgray pull-right no-margin uppercase">12%</span>
                                    </div>
                                    <div class="databox-row row-2 bordered-bottom bordered-ivory padding-10">
                                        <span class="badge badge-palegreen badge-empty pull-left margin-5"></span>
                                        <span class="databox-text darkgray pull-left no-margin hidden-xs">户外型</span>
                                        <span class="databox-text darkgray pull-right no-margin uppercase">11%</span>
                                    </div>
                                    <div class="databox-row row-2 padding-10">
                                        <span class="badge badge-yellow badge-empty pull-left margin-5"></span>
                                        <span class="databox-text darkgray pull-left no-margin hidden-xs">家电型</span>
                                        <span class="databox-text darkgray pull-right no-margin uppercase">10%</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
        </div>
        <!-- /Page Body -->
    </div>
    <!-- /Page Content -->
    </div>
    <!-- /Page Container -->
    <!-- Main Container -->

    </div>

    <!--Basic Scripts-->
    <script src="assets/js/jquery-2.0.3.min.js"></script>
    <script src="assets/js/bootstrap.min.js"></script>

    <!--Beyond Scripts-->
    <script src="assets/js/beyond.min.js"></script>


    <!--Page Related Scripts-->
    <!--Sparkline Charts Needed Scripts-->
    <script src="assets/js/charts/sparkline/jquery.sparkline.js"></script>
    <script src="assets/js/charts/sparkline/sparkline-init.js"></script>

    <!--Easy Pie Charts Needed Scripts-->
    <script src="assets/js/charts/easypiechart/jquery.easypiechart.js"></script>
    <script src="assets/js/charts/easypiechart/easypiechart-init.js"></script>

    <!--Flot Charts Needed Scripts-->
    <script src="assets/js/charts/flot/jquery.flot.js"></script>
    <script src="assets/js/charts/flot/jquery.flot.resize.js"></script>
    <script src="assets/js/charts/flot/jquery.flot.pie.js"></script>
    <script src="assets/js/charts/flot/jquery.flot.tooltip.js"></script>
    <script src="assets/js/charts/flot/jquery.flot.orderBars.js"></script>

    <script>
        // If you want to draw your charts with Theme colors you must run initiating charts after that current skin is loaded
        $(window).bind("load", function () {

            /*Sets Themed Colors Based on Themes*/
            themeprimary = getThemeColorFromCss('themeprimary');
            themesecondary = getThemeColorFromCss('themesecondary');
            themethirdcolor = getThemeColorFromCss('themethirdcolor');
            themefourthcolor = getThemeColorFromCss('themefourthcolor');
            themefifthcolor = getThemeColorFromCss('themefifthcolor');

            //Sets The Hidden Chart Width
            $('#dashboard-bandwidth-chart')
                .data('width', $('.box-tabbs')
                    .width() - 20);

            //-------------------------Visitor Sources Pie Chart----------------------------------------//
            var data = [
                {
                    data: [[1, 21]],
                    color: '#fb6e52'
                },
                {
                    data: [[1, 12]],
                    color: '#e75b8d'
                },
                {
                    data: [[1, 11]],
                    color: '#a0d468'
                },
                {
                    data: [[1, 10]],
                    color: '#ffce55'
                },
                {
                    data: [[1, 46]],
                    color: '#5db2ff'
                }
            ];
            var placeholder = $("#dashboard-pie-chart-sources");
            placeholder.unbind();

            $.plot(placeholder, data, {
                series: {
                    pie: {
                        innerRadius: 0.45,
                        show: true,
                        stroke: {
                            width: 4
                        }
                    }
                }
            });

            //------------------------------Visit Chart------------------------------------------------//
            var data2 = [{
                color: themesecondary,
                label: "管理员访问",
                data: [[3, 2], [4, 5], [5, 4], [6, 11], [7, 12], [8, 11], [9, 8], [10, 14], [11, 12], [12, 16], [13, 9],
                [14, 10], [15, 14], [16, 15], [17, 9]],

                lines: {
                    show: true,
                    fill: true,
                    lineWidth: .1,
                    fillColor: {
                        colors: [{
                            opacity: 0
                        }, {
                            opacity: 0.4
                        }]
                    }
                },
                points: {
                    show: false
                },
                shadowSize: 0
            },
            {
                color: themeprimary,
                label: "访问量",
                data: [[3, 10], [4, 13], [5, 12], [6, 16], [7, 19], [8, 19], [9, 24], [10, 19], [11, 18], [12, 21], [13, 17],
                [14, 14], [15, 12], [16, 14], [17, 15]],
                bars: {
                    order: 1,
                    show: true,
                    borderWidth: 0,
                    barWidth: 0.4,
                    lineWidth: .5,
                    fillColor: {
                        colors: [{
                            opacity: 0.4
                        }, {
                            opacity: 1
                        }]
                    }
                }
            },
            {
                color: themethirdcolor,
                label: "搜索引擎量",
                data: [[3, 14], [4, 11], [5, 10], [6, 9], [7, 5], [8, 8], [9, 5], [10, 6], [11, 4], [12, 7], [13, 4],
                [14, 3], [15, 4], [16, 6], [17, 4]],
                lines: {
                    show: true,
                    fill: false,
                    fillColor: {
                        colors: [{
                            opacity: 0.3
                        }, {
                            opacity: 0
                        }]
                    }
                },
                points: {
                    show: true
                }
            }
            ];
            var options = {
                legend: {
                    show: false
                },
                xaxis: {
                    tickDecimals: 0,
                    color: '#f3f3f3'
                },
                yaxis: {
                    min: 0,
                    color: '#f3f3f3',
                    tickFormatter: function (val, axis) {
                        return "";
                    },
                },
                grid: {
                    hoverable: true,
                    clickable: false,
                    borderWidth: 0,
                    aboveData: false,
                    color: '#fbfbfb'

                },
                tooltip: true,
                tooltipOpts: {
                    defaultTheme: false,
                    content: " <b>2月%x日</b> , <b>%s</b> : <span>%y</span>",
                }
            };
            var placeholder = $("#dashboard-chart-visits");
            var plot = $.plot(placeholder, data2, options);

            //------------------------------Real-Time Chart-------------------------------------------//
            var data = [],
                totalPoints = 300;

            function getRandomData() {

                if (data.length > 0)
                    data = data.slice(1);

                // Do a random walk

                while (data.length < totalPoints) {

                    var prev = data.length > 0 ? data[data.length - 1] : 50,
                        y = prev + Math.random() * 10 - 5;

                    if (y < 0) {
                        y = 0;
                    } else if (y > 100) {
                        y = 100;
                    }

                    data.push(y);
                }

                // Zip the generated y values with the x values

                var res = [];
                for (var i = 0; i < data.length; ++i) {
                    res.push([i, data[i]]);
                }

                return res;
            }
            // Set up the control widget
            var updateInterval = 100;
            var plot = $.plot("#dashboard-chart-realtime", [getRandomData()], {
                yaxis: {
                    color: '#f3f3f3',
                    min: 0,
                    max: 100,
                    tickFormatter: function (val, axis) {
                        return "";
                    }
                },
                xaxis: {
                    color: '#f3f3f3',
                    min: 0,
                    max: 100,
                    tickFormatter: function (val, axis) {
                        return "";
                    }
                },
                colors: [themeprimary],
                series: {
                    lines: {
                        lineWidth: 0,
                        fill: true,
                        fillColor: {
                            colors: [{
                                opacity: 0.5
                            }, {
                                opacity: 0
                            }]
                        },
                        steps: false
                    },
                    shadowSize: 0
                },
                grid: {
                    hoverable: true,
                    clickable: false,
                    borderWidth: 0,
                    aboveData: false
                }
            });

            function update() {

                plot.setData([getRandomData()]);

                plot.draw();
                setTimeout(update, updateInterval);
            }
            update();


            //-------------------------Initiates Easy Pie Chart instances in page--------------------//
            InitiateEasyPieChart.init();

            //-------------------------Initiates Sparkline Chart instances in page------------------//
            InitiateSparklineCharts.init();
        });

    </script>
    <!--Google Analytics::Demo Only-->
    <script>
        (function (i, s, o, g, r, a, m) {
            i['GoogleAnalyticsObject'] = r; i[r] = i[r] || function () {
                (i[r].q = i[r].q || []).push(arguments)
            }, i[r].l = 1 * new Date(); a = s.createElement(o),
                m = s.getElementsByTagName(o)[0]; a.async = 1; a.src = g; m.parentNode.insertBefore(a, m)
        })(window, document, 'script', 'http://www.google-analytics.com/analytics.js', 'ga');

        ga('create', 'UA-52103994-1', 'auto');
        ga('send', 'pageview');

    </script>


</body>
<!--  /Body -->

</html>